<template>
	<view class="">
		<uni-popup type="center" ref="address">
			<view class="bg-color-w padding-20 " style="width: 90vw;">
				<view class="f18-size f-w-500">Edit Address</view>
				
				<view class="grid grid-g10 grid-c-2 margin-t12">
					<view>
						<view class="flex f-a-c padding-tb10 ">
							<text class="t-color-r margin-r4">*</text>
							<text class="t-color-6">Full Name</text>
						</view>
						<view class="h-36 b-color-e">
							<input v-model="address.full_name" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="Full Name" />
						</view>
					</view>
					<view>
						<view class="flex f-a-c padding-tb10 ">
							<text class="t-color-r margin-r4">*</text>
							<text class="t-color-6">Email</text>
						</view>
						<view class="h-36 b-color-e">
							<input v-model="address.email" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="Email Address" />
						</view>
					</view>
				</view>
				
				<view class="margin-t12">
					<view class="flex f-a-c padding-tb10 ">
						<text class="t-color-r margin-r4">*</text>
						<text class="t-color-6">Address1</text>
					</view>
					<view class="h-36 b-color-e">
						<input v-model="address.address1" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="Address1" />
					</view>
				</view>
				
				<view class="grid grid-g10 grid-c-2 margin-t12">
					<view>
						<view class="flex f-a-c padding-tb10 ">
							<text class="t-color-6">Address2</text>
						</view>
						<view class="h-36 b-color-e">
							<input v-model="address.address2" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="Address2" />
						</view>
					</view>
					<view>
						<view class="flex f-a-c padding-tb10 ">
							<text class="t-color-6">Zip Code</text>
						</view>
						<view class="h-36 b-color-e">
							<input v-model="address.zip_code" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="Zip Code" />
						</view>
					</view>
				</view>
				
				<view class="grid grid-g10 grid-c-2 margin-t12">
					<view>
						<view class="flex f-a-c padding-tb10 ">
							<text class="t-color-6">Phone</text>
						</view>
						<view class="h-36 b-color-e">
							<input v-model="address.phone" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="Phone" />
						</view>
					</view>
					<view>
						<view class="flex f-a-c padding-tb10 ">
							<text class="t-color-r margin-r4">*</text>
							<text class="t-color-6">City</text>
						</view>
						<view class="h-36 b-color-e">
							<input v-model="address.city" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="City" />
						</view>
					</view>
				</view>
				
				<view class="grid grid-g10 grid-c-2 margin-t12">
					<view>
						<view class="flex f-a-c padding-tb10 ">
							<text class="t-color-r margin-r4">*</text>
							<text class="t-color-6">Country/Region</text>
						</view>
						<view class="h-36 b-color-e">
							<input v-model="address.country" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="Country/Region" />
						</view>
					</view>
					<view>
						<view class="flex f-a-c padding-tb10 ">
							<text class="t-color-r margin-r4">*</text>
							<text class="t-color-6">Zone</text>
						</view>
						<view class="h-36 b-color-e">
							<input v-model="address.zone" class="input padding-lr12 f14-size" type="text" value="" placeholder-class="t-color-9" placeholder="Zone" />
						</view>
					</view>
				</view>
				
				<view class="grid grid-g10 grid-c-2 margin-t20">
					<view @click="save" class="flex f-a-c f-j-c t-color-w bg-color-0 h-36">Save</view>
					<view @click="close()" class="flex f-a-c f-j-c t-color-0 b-color-3 h-36">Cancel</view>
				</view>	
				
			</view>
		</uni-popup>
	</view>
</template>
<style scoped>
</style>
<script>
	const $ = require('@/utils/api.js');
	let self = this;
	export default {
		components: {},
		data() {
			return {
				address: {
					address1: '',	
					address2: '',
					city: '',		
					country: '',		
					email: '',
					full_name: '',		
					phone: '',
					zip_code: '',		
					zone: '',
					id: '',
				},
				type: 'add',
			};
		},
		onLoad: function(options) {
			self = this;
			this.init();
		},
		onShow() {
		},
		methods: {
			save() {
				self = this;
				if(this.address.full_name == '' || this.address.email == '' ||this.address.address1 == '' ||this.address.city == '' ||this.address.country == '' ||this.address.zone == '') {
					$.$toast('请填写完整信息');
					return;
				}
				let url = '/v1/tk_shop/user/address/create';
				if(this.type == 'edit') {
					url = '/v1/tk_shop/user/address/edit';
				}
				$.ajax({
					url: url,
					data: this.address,
					method: 'POST',
					loading:true,
					success(res) {
						if(res.data.token) {
							uni.setStorageSync('token',res.data.token);
						}
						$.$toast('Successful');
						self.close();
						self.$emit('onChange',res.data);
					}
				})
			},
			
			open(info) {
				if(info) {
					this.type = 'edit';
					this.address = Object.assign(this.address,info);
				}else{
					// this.type == 'add';
				}
				this.$refs.address.open();
			},
			close() {
				this.$refs.address.close();
			},
			add() {},
			init() {},
		},
		computed: {},
		created() {
		},
		mounted() {},
		destroyed() {},
		onPullDownRefresh() {
		},
		onReachBottom() {
			
		}
	}
</script>